<template>
  <div>
   <el-container>
     <el-header>
   <div class="top">
    <el-menu
      :default-active="$router.path"
      router
      class="el-menu-demo"
      mode="horizontal"
      background-color="#2D2D2D"
      text-color="#b0b0b0"
      active-text-color="#FFFFFF">
      <el-menu-item>登录 | 注册</el-menu-item>
      <el-menu-item index="3">我的订单</el-menu-item>
      <el-menu-item index="4">我的收藏</el-menu-item>
      <el-menu-item index="5">购物车</el-menu-item>
    </el-menu>
   </div>
   <div class="bottom">
    < img src="../assets/imgs/logo.png" alt="">
    <div class="center">
     <el-menu 
       :default-active="activeIndex"  
       mode="horizontal" >
       <el-menu-item index="1">首页</el-menu-item>
       <el-menu-item index="3">全部商品</el-menu-item>
       <el-menu-item index="4">关于我们</el-menu-item>
     </el-menu>
    </div>
    <div></div>
    <div></div>
    <div></div>
    <div>
     <el-input placeholder="请输入内容"  class="input-with-select">
         <el-button slot="append" icon="el-icon-search"></el-button>
     </el-input>
    </div>
   </div>
  </el-header>
     <el-main>Main</el-main>
     <el-footer>Footer</el-footer>
   </el-container>
  </div>
</template>

<script>
 import API from "../api/home";
    export default {
        created(){
            this.getCarousel()
        },
        data(){
            return {
                carousel: null
            }
        },
        methods:{
            async getCarousel(){
                 let {data:res} = await API.getCarousel();
                 console.log(res)
            }
        }

    }
</script>
<style>
 .el-header{
     width: 100%;
  height: 120px;
  padding: 0;
  margin-bottom: 100px;
  background-color: #2D2D2D;
 }
 .top{
  height: 40px;
  width: 90%;
  margin: 0 auto;
  background-color: #2D2D2D;
 }
 .bottom{
  height: 60px;
  width: 90%;
  margin: 20px auto;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #b0b0b0;
 }
 .el-footer {
  width: 100%;
  background-color: #2D2D2D;
 }
 .el-menu-demo{
  